<template>
	<view class="u-p-20">
		
			<view class="u-p-b-20 " style="border-bottom: 1rpx solid #E1E1E1;">
				<view class="u-flex ">
						<view class="u-p-t-20">
							<u-image src='https://www.sqkjkj.vip/wxImg/login/4.png' width='28rpx' height='28rpx'></u-image>
						</view>
						<view class=" u-b-r-20 u-m-t-26 u-p-l-20" >
							<u-input type='number' placeholder="请输入手机号" maxlength='11' v-model='phone'></u-input>
						</view>
					</view>
				
			</view>
			
			<view class="u-p-b-20 u-flex u-row-between" style="border-bottom: 1rpx solid #E1E1E1;">
				<view class="u-flex ">
						<view class="u-p-t-20">
							<u-image src='https://www.sqkjkj.vip/wxImg/login/5.png' width='28rpx' height='28rpx'></u-image>
						</view>
						<view class=" u-b-r-20 u-m-t-26 u-p-l-20" >
							<u-input type='number' placeholder="请入验证码" maxlength='11' v-model='code'></u-input>
						</view>
				</view>
				<view class="u-p-t-20">
						<view class="u-p-r-24 u-font-26 u-p-l-30 u-w-200"
					style="color: #FC3533; border-left: 1rpx solid #FC3533;" @click="get_code" v-if="get_num==60">
					获取验证码</view>
				<view class="u-p-r-24 u-font-26 u-p-l-30 u-w-200 u-text-center"
					style="color: #FC3533; border-left: 1rpx solid #FC3533;" v-else>{{get_num}}S</view>
				</view>
			
			</view>
			<view class="u-p-b-20" style="border-bottom: 1rpx solid #E1E1E1;">
				<view class="u-flex ">
						<view class="u-p-t-20">
							<u-image src='https://www.sqkjkj.vip/wxImg/login/6.png' width='28rpx' height='28rpx'></u-image>
						</view>
						<view class=" u-b-r-20 u-m-t-26 u-p-l-20" >
							<u-input type='password' placeholder="设置登陆密码" maxlength='11' v-model='password'></u-input>
						</view>
					</view>
				
			</view>
			<view class="u-p-b-20" style="border-bottom: 1rpx solid #E1E1E1;">
				<view class="u-flex ">
						<view class="u-p-t-20">
							<u-image src='https://www.sqkjkj.vip/wxImg/login/6.png' width='28rpx' height='28rpx'></u-image>
						</view>
						<view class=" u-b-r-20 u-m-t-26 u-p-l-20" >
							<u-input type='password' placeholder="确认登陆密码" maxlength='11' v-model='password1'></u-input>
						</view>
					</view>
				
			</view>
				<view class="u-m-t-40 u-p-b-20">
				<u-button :customStyle="customStyle" :ripple="ripple" :hair-line="hairLine" class="blFF_FD u-b-r-20"
					@click="submit">提交
				</u-button>
			
			</view>
		<u-toast ref="uToast" />
	</view>
</template>
<script>
	export default {
		data() {
			return {
				phone:'',
				get_num:'60',
				code:'',
				password:'',
				password1:'',
				// 表单参数
				model: {
					mobile: '',
					code: '',
					captcha:'',
					loginpass: '',
					quepass:'',
					guard:'member'
				},
				// 正则验证参数
				rules: {
					mobile: [{
						required: true,
						message: '请输入手机号',
						trigger: 'blur',
					}, {
						// 自定义验证函数，见上说明
						validator: (rule, value, callback) => {
							// 上面有说，返回true表示校验通过，返回false表示不通过
							// this.$u.test.mobile()就是返回true或者false的
							return this.$u.test.mobile(value);
						},
						message: '手机号码不正确',
						// 触发器可以同时用blur和change
						trigger: ['change', 'blur'],
					}],
					code: [{
						required: true,
						message: '请输入验证码',
						trigger: 'blur',
					}],
					// captcha: [{
					// 	required: true,
					// 	message: '请输入图形验证码',
					// 	trigger: 'blur',
					// }],		
					code: [{
						required: true,
						message: '请输入验证码',
						trigger: 'blur',
					}],
				},
				// 图形验证码
				uuid:'',
				imgCode:'',
				//验证码参数
				codeTips: '获取验证码',
				// button参数
				hairLine: true,
				ripple: true,
				customStyle: this.$styleCls.btnStyle
			}
		},
		onLoad() {
			// this.get_img_code()
		},
		onShow() {
			
		},
		// onReady() {
		// 	this.$refs.uForm.setRules(this.rules);
		// },
		methods: {
			get_code(){
				console.log(this.phone);
				if (this.phone.trim() == '' || !(
						/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/).test(this.phone)) {
					uni.showToast({
						icon: 'none',
						title: "请输入正确手机号码"
					})
				
				}else{
					this.$api.sed_code({
								mobile: this.phone,
								type:'forget',
								uuid:' ',
								captcha:''
								
					},res=>{
						console.log(res);
						if(res.data.code==1){
							this.get_num=59
					let arr=setInterval(()=>{
						if(this.get_num>=1){
							this.get_num--
						}else{
							this.get_num=60
							clearInterval(arr)
							
						}
					},1000)
						}
					})
					
				}
			},
			// 提交
			submit(){
				 if(this.code.trim()==''){
					uni.showToast({
						icon:'none',
						title:'请输入验证码'
					})
				}else if(this.password.trim()==''){
					uni.showToast({
						icon:'none',
						title:'请输入登录密码'
					})
				}else if(this.password!=this.password1){
					uni.showToast({
						icon:'none',
						title:'登陆密码两次输入不一致'
					})
				}else{
					this.$api.forget_password({
						mobile:this.phone,
						code:this.code,
						loginpass:this.password,
						quepass:this.password1
					},res=>{
						console.log(res);
						uni.showToast({
							icon:'none',
							title:res.data.msg
						})
						setTimeout(()=>{
							if(res.data.code==1){
							uni.redirectTo({
								url:'/pages/login/login'
							})
						}
						},500)
					})
				}
			},
			
		}
	}
</script>

<style lang="scss">
	page {
		width: 100%;
		height: 100%;
	}
</style>
